﻿					
					<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
					
					<div class="content">
						<div class="module">
							<div class="module-body">														
								<section class="docs">
									<h4>用户反馈</h4>
									<p>填写下表向管理员提供您的问题和建议，管理员在接到邮件后会按顺序处理您的反馈。</p>
								</section>
								<br />
								<form class="form-horizontal row-fluid" id="feedback-form">					
									<div class="control-group">
										<label class="control-label">类型</label>
										<div class="controls">
											<label class="radio inline"> <input type="radio" name="type" id="type1" value="question" checked="checked"> 问题
											</label> <label class="radio inline"> <input type="radio" name="type" id="type2" value="suggestion"> 建议
											</label> <label class="radio inline"> <input type="radio" name="type" id="type3" value="other"> 其他
											</label>
										</div>
									</div>
					
									<div class="control-group">
										<label class="control-label" for="basicinput">标题</label>
										<div class="controls">
											<input type="text" name="title" id="title1" placeholder="输入反馈的标题..." class="span8" maxlength="30"> <span class="help-inline">不超过30个字符</span>
										</div>
									</div>
					
									<div class="control-group">
										<label class="control-label" for="basicinput">类别</label>
										<div class="controls">
											<select tabindex="1" name="category" id="category1" data-placeholder="选择类别..." class="span8">
												<option value="">选择类别...</option>
												<option value="hardware">硬件相关</option>
												<option value="software">软件相关</option>
												<option value="operation">运维相关</option>
												<option value="other">其他</option>
											</select>
										</div>
									</div>
					
									<div class="control-group">
										<label class="control-label" for="basicinput">描述</label>
										<div class="controls">
											<textarea name="content" id="content1" class="span8" rows="5" maxlength="1000"></textarea><span class="help-inline">不超过1000个字符</span>
										</div>
									</div>
					
									<div class="control-group">
										<label class="control-label" for="basicinput">提交人</label>
										<div class="controls">
											<input type="text" name="name" id="name1" placeholder="输入您的姓名..." class="span8" maxlength="10"> <span class="help-inline">不超过10个字符</span>
										</div>
									</div>
									
									<div class="control-group">
										<div class="controls">
											<button type="submit" class="btn" id="submit-button">提交表单</button>
										</div>
										<br />
										<div id="message-box1" class="controls">
											<button type="button" class="close" data-dismiss="alert">×</button>	
											<p id="message-content"></p>			
										</div>										
									</div>
								</form>
							</div>
						</div>
					</div>

					<script src="<c:url value="/resources/scripts/jquery-1.9.1.min.js"/>" type="text/javascript"></script>
					<script src="<c:url value="/resources/scripts/jquery-ui-1.10.1.custom.min.js"/>" type="text/javascript"></script>
					<script src="<c:url value="/resources/bootstrap/js/bootstrap.min.js"/>" type="text/javascript"></script>
					<script src="<c:url value="/resources/scripts/flot/jquery.flot.js"/>" type="text/javascript"></script>
<%-- 					<script src="<c:url value="/resources/scripts/flot/jquery.flot.resize.js"/>" type="text/javascript"></script> --%>
<%-- 					<script src="<c:url value="/resources/scripts/datatables/jquery.dataTables.js"/>" type="text/javascript"></script> --%>
<%-- 					<script src="<c:url value="/resources/scripts/common.js"/>" type="text/javascript"></script>					 --%>
			
					<script type="text/javascript">
						$(document).ready(function() {
							$("#message-box1").hide();
						});
						
						$("#submit-button").click(function(){
							title = $.trim($("#title1").val());
							category = $("#category1").val();
							content = $("#content1").val();
							name = $("#name1").val();
							
							if ((title.length <= 0) || (title.length > 30)) {
								$("#title1").focus()
								return false;	// 不刷新页面
							} else if (category == "") {
								$("#category1").focus()
								return false;
							} else if ((content.length <= 0) || (content.length > 1000)) {
								$("#content1").focus()
								return false;
							} else if ((name.length <= 0) || (name.length > 1000)) {
								$("#name1").focus()
								return false;
							} else {
								$.ajax({
									url: "<c:url value="/feedback" />",
									type: "POST",
									data: $('#feedback-form').serialize(),
									    
									success: function(data, textStatus, jqXHR) {
										if (data == "ok") {
											$("#message-box1").attr("class", "controls alert alert-success");
											$("#message-content").text("提交成功");
											$("#message-box1").show().fadeOut(5000);
										} else {
											$("#message-box1").attr("class", "controls alert alert-error");
											$("#message-content").text("提交失败");
											$("#message-box1").show().fadeOut(5000);									
										}
									},
									 
									error: function(jqXHR, textStatus, errorThrown){
										$("#message-box1").attr("class", "controls alert alert-error");
										$("#message-content").text("数据传输失败");
										$("#message-box1").show().fadeOut(5000);
										// alert(jqXHR.responseText);
									},
									
									beforeSend: function(jqXHR, settings) {
										 $('#submit-button').attr("disabled", true);
									},
									
									complete: function(jqXHR, textStatus) {
										 $('#submit-button').attr("disabled", false);
									},
								 });					
							}
						});
					</script>